<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<base href="<%=basePath %>">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="<%=basePath %>res/wsz/js/jquery-1.10.2.js"></script>
<script type="text/javascript" src="<%=basePath %>res/wsz/js/base.js"></script>
<title>订单详情页面</title>
<style>
	span{
		margin-left:20px;
	}
	hr{
		border:1px solid #ccc;
		width:700px;
		margin-left:0px;
	}
	a{
		text-decoration:none;
	}
	#up{
		border:1px solid #ccc;
		width: 702px;
		height: 80px;
	}
	#left{
		border:1px solid #ccc;
		width: 360px;
		height: 332px;
		float:left;
	}
	#left table{
		width: 360px;
		text-align:center;
	}
	#left table th,td{
		height:50px;
		text-align:center;
		border-bottom:1px solid #ccc;
	}
	#left #hong{
		float:right;
		margin-right:20px;
	}
	#left #hong a{
		font-size:34px;
		color:red;
		margin-left:0px;
	}
	#right{
		border:1px solid #ccc;
		width: 310px;
		height: 312px;
		float:left;
		padding:20px 15px 0px;
	}
	.a{
		border-radius:10px;
		background:#ff6666;
		float:right;
		color: white;
		margin-right:30px;
		padding:8px;
	}
	#zj{
		margin-left:100px;
	}
	.bj{
		margin-left:20px;
	}
</style>
<script type="text/javascript">
	$(function(){
		var url = "<%=basePath %>fodDetail/selectAll?indentId="+sessionStorage['indentId'];
		var fodPrice = 0;
		$.post(url, null, function(mes) {
			 $.each(mes.list, function(index, item) {
				$("#body").append("<tr><td>"+item.foodName+"</td><td>"+item.foodNum+"</td><td>"+item.foodPrice+"</td><td>"+item.foodPrice*item.foodNum+"</td></tr>");
				fodPrice = fodPrice + item.foodPrice*item.foodNum
				$("#foodPrice").text(fodPrice);
				$(".merchantName").html(mes.merchantName);
				$("#indentName").html(mes.indentName);
				$("#merchantPhone").html(mes.merchantPhone);
			 });
	    }, "json");
	});
</script>
</head>
<body>
	<div>
		<div>
			<h3><span>订单详情</span></h3>
		</div>
		<hr />
		<div>
			<div id="up">
				<p class="bj"><i class="merchantName"></i>
					<a href="" class="a">投诉</a>
					<a href="" class="a">收藏</a>
				</p>
				<p class="bj">订单号：<a id="indentName"></a>
					<a id="zj">商家电话:<i id="merchantPhone"></i></a>
				</p>
			</div>
			<div id="left">
				<table cellspacing="0">
					<thead>
						<tr>
							<th>菜品</th>
							<th>数量</th>
							<th>单价</th>
							<th>小计（元）</th>
						</tr>
					</thead>
					<tbody id="body">
						
					</tbody>
					
				</table>
				<p id="hong"><span>配送费：5&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
				</span>食品支付：<a id="foodPrice"></a></p>
			</div>
			<div id="right">
				<span>配送信息</span>
				<p>配送方式：<a class="merchantName"></a>提供配送服务</p>
				<p>送达时间： 尽快送出</p>
				<br />
				<c:forEach items="${list }" var="list" >
					<p>${list.userName }</p>
					<p>联系电话： ${list.manPhone }</p>
					<p>收货地址： 香樟路110号一度软件教育</p>
				</c:forEach>
			</div>
		</div>
	</div>
</body>
</html>